🛠 TypeScriptでオブジェクトの型定義を理解しよう

今回はTypeScriptにおけるオブジェクトの型の記載方法を確認していいきましょう！型を書くメリットは、TSが型チェックをしてくれることです。

定義した型に合わない値が代入される可能性がある場合は、コンパイル時にエラーになるので、事前にバグを防ぐことができます。

オブジェクトの型

{　} の中にプロパティ名: 型を記載する

const member: {
    name: string,
    age: number
} = {
    name: 'taro',
    age: 12
}

type文

type文は新たに型を作るのではなく、すでにある型に別名をつけるだけのもの

type TMember = {
    name: string,
    age: number
}

const member: TMember = {
    name: 'taro',
    age: 12
}

interface宣言

実務ではinterfaceを見かけることがあるので記載。 type文では任意の型に対して、別名で宣言することができたが、interfaceで扱えるのはオブジェクトだけ。

ほとんどのケースでinterfaceの代わりにtype文で代用可能なので、使う必要はない。

interface TMember {
    name: string,
    age: number
}

const member: TMember = {
    name: 'taro',
    age: 12
}

読み取り専用

プロパティを読み取り専用として、型宣言することができる。

type TMember = {
    readonly id: number
    name: string,
    age: number
}

const member: TMember = {
    id: 1,
    name: 'taro',
    age: 12
}

// Cannot assign to 'id' because it is a read-only property
member.id = 1

プロパティの包含関係

type TMember = {
    readonly id: number
    name: string,
    age: number
}

type TGroup = {
    name: string
    leader: TMember
    subLeader: TMember
}